.container {
    background-color: #000000;
}

.top-name {
    width: 750upx;
    position: fixed;
    top: 120upx;
    left: 0;
    flex-direction: row;
}

.top-but {
    width: 40rpx;
    height: 40rpx;
    margin-left: 20rpx;
    margin-right: 10rpx;
}

.top-text {
    width: 100upx;
    font-size: 34rpx;
    line-height: 40rpx;
    color: #ffffff;
    font-weight: bold;
    lines: 1;
    text-overflow: ellipsis;
}

.videoHover {
   position: absolute;
   top: 0;
   left: 0;
   flex: 1;
   background-color: rgba(0, 0, 0);
   justify-content: center;
   align-items: center;
}

.playState {
    width: 160rpx;
    height: 160rpx;
}

.userInfo {
    position: absolute;
    bottom: 0px;
    right: 10px;
    flex-direction: column;
}

.userInfobox {
    width: 60px;
    margin-top: 20rpx;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
}

.usericontuo {
    width: 30px;
    height: 30px;
    margin: auto;
    margin-bottom: 14rpx;
}

.usertexttuo {
    width: 60px;
    lines: 1;
    text-overflow: ellipsis;
    color: #ffffff;
    font-size: 12px;
    text-align: center;
    font-weight: bold;
}

.likeNumActive {
    color: red;
}

.content {
    width: 720rpx;
    z-index: 99;
    position: absolute;
    bottom: 30px;
    /* justify-content: center; */
    padding: 15rpx;
    flex-direction: column;
    justify-content: flex-start;
    color: #ffffff;
}

.userName {
    font-size: 34rpx;
    color: #ffffff;
    margin-top: 80upx;
    font-weight: bold;
    lines: 1;
    text-overflow: ellipsis;
    margin-bottom: 10rpx;
}

.netMsg {
    font-size: 24rpx;
    color: #ffffff;
    lines: 2;
    text-overflow: ellipsis;
}

.netMsgTO {
    font-size: 24rpx;
    color: #ffffff;
}

.words {
    margin-top: 16rpx;
    font-size: 30rpx;
    color: #ffffff;
    overflow: hidden;
    text-overflow: ellipsis;
}

.WorksSelected {
   height: 900rpx;
   background-color: #202020;
   border-top-left-radius: 10px;
   border-top-right-radius: 10px;
}

.WorksSelectedName {
    margin: 50rpx 20rpx 20rpx 20rpx;
    position: relative;
}

.WorksSelectedtext {
    margin-left: 30px;
    font-size: 12px;
    position: absolute;
    left: 30px;
}

.WorksSelectedMsg {
    display: flex;
    font-size: 14px;
    color: #ffffff;
    lines: 1;
    text-overflow: ellipsis;
}

.WorksSelectedMsgto {
    display: flex;
    font-size: 12px;
    color: #ffffff;
    lines: 2;
    text-overflow: ellipsis;
    margin-top: 6px;
}

.scrollBox {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
}

.selectedButton {
    width: 120rpx;
    height: 80rpx;
    background-color: #595959;
    margin-bottom: 30rpx;
    border-radius: 6px;
    position: relative;
    margin: 10rpx;
    /* 项目间隔 */
}

.selectedImg1 {
    width: 60rpx;
    height: 40rpx;
    position: absolute;
    top: 20rpx;
    left: 28rpx;
}

.selectedImg2 {
    width: 30rpx;
    height: 30rpx;
    position: absolute;
    top: 0rpx;
    right: 0rpx;
}

.selectedText {
    text-align: center;
    line-height: 80rpx;
    font-size: 12px;
    color: #ffffff;
}

.unlockBox {
    background-color: #202020;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding: 50rpx 0 60rpx 0;
}

.unlockBoxJuzhong {
    display: flex;
    justify-content: center;
    align-items: center;
}

.unlockButton1 {
    width: 630rpx;
    padding: 20rpx 0;
    background-color: #ff0049;
    border-radius: 99px;
    margin-top: 44rpx;
    margin: auto;
    flex-direction: row;
    justify-content: center;
}

.unlockButton2 {
// width: 630rpx;
// padding: 20rpx 0;
// background-color: #FF943D;
    border-radius: 99px;
// margin-top: 44rpx;
    margin: auto;
    flex-direction: row;
    justify-content: center;
}

.unlockButton4 {
    width: 630rpx;
    padding: 20rpx 0;
    background-color: #ff943d;
    border-radius: 99px;
    margin-top: 44rpx;
    margin: auto;
    display: flex;
    flex-direction: row;
    justify-content: center;
}

.unlockButton3 {
    flex-direction: row;
    justify-content: center;
    margin-top: 30rpx;
}

.unlockButtonText {
    color: #ffffff;
    font-family: PingFang SC;
    font-size: 24rpx;
    font-weight: 400;
    text-align: center;
}

.unlockButtonIcon {
    width: 28rpx;
    height: 28rpx;
    margin-right: 10rpx;
}

.titleTop {
    flex-direction: row;
}

.titleBox {
    flex-direction: column;
}

.money {
    font-weight: 500;
    font-size: 28rpx;
    color: #ffffff;
}

.payBox {
    background-color: #262626;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding: 36rpx;
}

.tips {
    margin-top: 20rpx;
}

.title {
    font-weight: 500;
    font-size: 30rpx;
    color: #ffffff;
    margin-bottom: 10rpx;
}

.otherText {
    font-weight: 500;
    font-size: 12px;
    color: #ffffff;
    margin-bottom: 10rpx;
}

.payShopBox {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}

.payShopDev {
    width: 330rpx;
    border-radius: 9px;
    background-color: #414141;
    overflow: hidden;
    margin-bottom: 20rpx;
}

.integral {
    flex-direction: row;
    justify-content: center;
}

.priceBox {
    height: 48rpx;
    background: rgb(92, 92, 92);
}

.priceBoxTo {
    height: 48rpx;
    background: #ff0049;
}

.amount {
    font-size: 32rpx;
    color: #ffffff;
    font-family: DIN;
    font-weight: 500;
}

.amount_text {
    color: #ffffff;
    font-family: DIN;
    font-size: 20rpx;
    font-weight: 500;
    margin-left: 10rpx;
    margin-top: 10rpx;
}

.add {
    font-size: 24rpx;
    color: #ff0049;
    font-family: DIN;
    font-weight: 500;
    line-height: 48rpx;
}

.rechargeBox {
    position: relative;
}

.rechargeIco {
    width: 108rpx;
    height: 108rpx;
}

.baifenbi {
    position: absolute;
    top: 10rpx;
    right: 40rpx;
    border-radius: 4px;
    padding: 2rpx 4rpx;
}

.neirong {
    font-size: 18rpx;
    font-weight: 400;
    color: #ffffff;
}

.price {
    font-size: 32rpx;
    font-weight: 500;
    color: #fff;
    text-align: center;
}

::v-deep .uni-video-bar {
    background-color: rgba(0, 0, 0, 0) !important;
    margin-bottom: 40px !important;
}

.login-box {
    width: 600rpx;
    background-color: #121421;
    padding: 50rpx 30rpx;
    border-radius: 20rpx;
}

.login-msg {
    font-size: 24rpx;
    color: #ffffff;
    text-align: center;
}

.btns-box {
    margin-top: 50rpx;
    height: 80rpx;
    background-color: #fe3e78;
    border-radius: 16rpx;
    line-height: 80rpx;
}

.btn {
    color: #ffffff;
    line-height: 80rpx;
    font-size: 24rpx;
    text-align: center;
}

.commentBox {
    border-radius: 10px 10px 0px 0px;
    background: rgb(38, 38, 38);
    position: relative;
}

.commentBoxName {
    color: rgb(255, 255, 255);
    font-family: PingFang SC;
    font-size: 28rpx;
    font-weight: 400;
    text-align: center;
    margin-bottom: 30rpx;
}

.commentXIcon {
    /* Ellipse 47 */
    position: absolute;
    width: 48rpx;
    height: 48rpx;
    right: 36rpx;
    top: 36rpx;
}

.comenBlooc {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-bottom: 40rpx;
}

.comenBloocTo {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    overflow-y: auto;
    transition-property: height;
    transition-duration: 1s;
    overflow: hidden;
}

.comHFbox {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
}

.comName {
    color: rgb(179, 179, 179);
    font-family: PingFang SC;
    font-size: 26rpx;
    font-weight: 400;
}

.comMsg {
    color: rgb(255, 255, 255);
    font-family: PingFang SC;
    font-size: 30rpx;
    font-weight: 400;
    margin-bottom: 6rpx;
}

.comHFBut {
    color: rgb(153, 153, 153);
    font-family: PingFang SC;
    font-size: 26rpx;
    font-weight: 400;
    margin-bottom: 6rpx;
}

.comBottomBut {
    color: rgb(118, 118, 118);
    font-family: PingFang SC;
    font-size: 24rpx;
    font-weight: 400;
    padding: 10rpx 0;
}

.InputBox {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    color: #ffffff;
    padding: 10rpx 20rpx;
    background-color: #5b5b5b;
    border-radius: 90rpx;
}

.pinglun {
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: #3c3c3c;
}

.tripleSpeed {
    width: 80rpx;
    position: fixed;
    top: 120upx;
    right: 10upx;
}

.tripleSpeedBut {
    background-color: #2a2a2a;
    padding: 8rpx 0;
    border-radius: 10rpx;
    margin-right: 20rpx;
    width: 80rpx;
    text-align: center;
    margin-bottom: 10rpx;
}

.tripleSpeedButTo {
    background-color: #fe3e78;
    padding: 8rpx 0;
    border-radius: 10rpx;
    margin-right: 20rpx;
    width: 80rpx;
    text-align: center;
    margin-bottom: 10rpx;
}

.tripleSpeedText {
    color: #ffffff;
    font-size: 24rpx;
    font-weight: 400;
    margin: auto;
    text-align: center;
}

.subtitles {
    width: 750rpx;
    position: fixed;
    top: 200px;
    /* 你可以根据需要调整这个值来控制元素距离顶部的距离 */
    left: 0;
    padding: 10px;
    z-index: 999;
    color: #ffffff;
    font-size: 40rpx;
    flex-direction: row;
    justify-content: center;
}

.nueSubtitles {
    text-align: center;
    width: 500rpx;
    margin: auto;
    font-size: 40px;
    color: #ffffff;
}

.vipBox {
// width: 660rpx;
    height: 114rpx;
    position: relative;
}

.vipDev1 {
// width: 660rpx;
    height: 114rpx;
    border-radius: 8px;
    background: linear-gradient(to right, #ff0049, #ff933b);
}

.vipDev2 {
// width: 660rpx;
    height: 114rpx;
    border-radius: 8px;
    background: linear-gradient(to right, #c72bd3, #2f0069);
}

.vipDev3 {
// width: 660rpx;
    height: 114rpx;
    border-radius: 8px;
    background: linear-gradient(to right, #615de3, #ff3deb);
}

.vipDev4 {
    width: 660rpx;
    height: 114rpx;
    border-radius: 8px;
    background: linear-gradient(to right, #615de3, #ff3deb);
}

.vipNorw {
    padding: 30rpx;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.vipNorw_text1 {
    color: #ffffff;
    font-family: PingFang SC;
    font-size: 22rpx;
    font-weight: 600;
    margin-top: 0rpx;
    margin-left: 30rpx;
    max-width: 400rpx;
}

.vipNorw_text2 {
    padding: 6rpx 20rpx;
    color: #ffffff;
    font-family: PingFang SC;
    font-size: 24rpx;
    font-weight: 400;
    border-radius: 32px;
    background: #ff0049;
    margin-top: 4rpx;
}

.videoInfoBox {
    background-color: #050505;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding: 50rpx 30rpx 30rpx 30rpx;
    position: relative;
}

.videoInfoName {
    color: #ffffff;
    font-family: PingFang SC;
    font-size: 30rpx;
    font-weight: 400;
    width: 360rpx;
    /* 或者你需要的任何宽度 */
    white-space: normal;
}

.videoInfoRot {
    font-size: 24rpx;
    font-weight: 400;
    color: #ffffff;
    lines: 2;
    text-overflow: ellipsis;
    font-family: PingFang SC;
}

.videoInfoText {
    color: #807f7f;
    font-family: PingFang SC;
    font-weight: 400;
    font-size: 24rpx;
}

.videoInfoBottom {
    position: absolute;
    top: 50rpx;
    right: 10rpx;
    flex-direction: row;
    justify-content: center;
    padding: 14rpx 24rpx;
    background-color: #ff0049;
    border-radius: 99rpx;
}

.videoInfoBottomText {
    color: #ffffff;
    font-family: PingFang SC;
    font-size: 20rpx;
    font-weight: 400;
    line-height: 32rpx;
    margin-left: 8rpx;
}

.shareBox {
    height: 900rpx;
    position: relative;
}

.shareImg {
    display: block;
    width: 100%;
    height: 900rpx;
}

.shareText {
    position: absolute;
    top: 320rpx;
    left: 0;
}

.shareText_v1 {
    font-size: 28rpx;
    font-weight: 600;
    text-align: left;
    color: #ea624a;
    margin-bottom: 4rpx;
}

.shareText_v2 {
    font-size: 32rpx;
    font-weight: 600;
    text-align: center;
    margin-top: 10rpx;
    color: #ea624a;
}

.shareText_box1 {
    flex-direction: row;
    justify-content: center;
    margin-top: 26rpx;
}

.shareText_v3 {
    padding: 8rpx 60rpx;
    margin: auto;
    font-size: 38rpx;
    font-weight: 600;
    text-align: center;
    color: #000000;
    border-radius: 26px;
    background-color: #fece81;
}
